<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" href="../nfwt.ico" />
    <link href="https://unpkg.com/element-plus@2.1.9/dist/index.css" rel="stylesheet"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>CDN的 importmap 方式</title>
    
  </head>
  <body>
    <script type="importmap">
      {
        "imports": {
          "dayjs": "https://unpkg.com/dayjs@1.11.1/esm/index.js",
          "elementPlus": "https://unpkg.com/element-plus@2.1.9/es/index.mjs",
          "vue": "https://unpkg.com/vue@3.2.33/dist/vue.esm-browser.js"
        }
      }
    </script>
    <div id="app">
      <button @click="count++">自增</button> <br>
      <el-button @click="count++" >自增</el-button> <br>
      {{ count }}
    </div>
    <script type="module">
      import { ref, createApp } from 'vue'
      import elp from 'elementPlus'

      const app = {
        setup() {
          const count = ref(0)
          return {
            count
          }
        }
      }
      
      createApp(app)
        .use(elp)
        .mount('#app')
    </script>
  </body>
</html>
